﻿@using DevExtreme.NETCore.Demos.Models

@model IEnumerable<Order>

@(Html.DevExtreme().DataGrid<Order>()
    .ID("gridContainer")
    .DataSource(Model)
    .ShowBorders(true)
    .GroupPanel(groupPanel => groupPanel.Visible(true))
    .Grouping(grouping => grouping.AutoExpandAll(true))
    .SortByGroupSummaryInfo(i => i.Add().SummaryItem("count"))
    .OnCellPrepared("cellPrepared")
    .Export(e => e.Enabled(true).CustomizeExcelCell("customizeExcelCell"))
    .Columns(columns => {
        columns.AddFor(m => m.Employee)
            .GroupIndex(0);

        columns.AddFor(m => m.OrderNumber)
            .Width(130);

        columns.AddFor(m => m.OrderDate)
            .Width(160);

        columns.AddFor(m => m.CustomerStoreCity)
            .GroupIndex(1);

        columns.AddFor(m => m.CustomerStoreState);

        columns.AddFor(m => m.SaleAmount)
            .Alignment(HorizontalAlignment.Right)
            .Format(Format.Currency)
            .SortOrder(SortOrder.Desc);
    })
    .Summary(s => s
        .GroupItems(groupItems => {
            groupItems.AddFor(m => m.OrderNumber)
                .SummaryType(SummaryType.Count)
                .DisplayFormat("{0} orders")
                .AlignByColumn(false);

            groupItems.AddFor(m => m.SaleAmount)
                .SummaryType(SummaryType.Max)
                .DisplayFormat("Max: {0}")
                .ValueFormat(Format.Currency)
                .AlignByColumn(true)
                .ShowInGroupFooter(false);

            groupItems.AddFor(m => m.SaleAmount)
                .SummaryType(SummaryType.Sum)
                .DisplayFormat("Sum: {0}")
                .ValueFormat(Format.Currency)
                .AlignByColumn(true)
                .ShowInGroupFooter(true);
        })

        .TotalItems(totalItems => {
            totalItems.AddFor(m => m.SaleAmount)
                .SummaryType(SummaryType.Sum)
                .DisplayFormat("Total Sum: {0}")
                .ValueFormat(Format.Currency);
        })
    )
)

<script>
    function cellPrepared(e) {
        if(e.rowType === 'data') {
            if(e.data.OrderDate < new Date(2014, 2, 3)) {
                e.cellElement.css({ color: '#AAAAAA' });
            }
            if(e.data.SaleAmount > 15000) {
                if(e.column.dataField === 'OrderNumber') {
                    e.cellElement.css({ 'font-weight': 'bold' });
                }
                if(e.column.dataField === 'SaleAmount') {
                    e.cellElement.css({ 'background-color': '#FFBB00', color: '#000000' });
                }
            }
        }

        if(e.rowType === 'group') {
            if(e.row.groupIndex === 0) {
                e.cellElement.css({ 'background-color': '#BEDFE6', 'color': '#000' });
            }
            if(e.row.groupIndex === 1) {
                e.cellElement.css({ 'background-color': '#C9ECD7', 'color': '#000' });
            }
            e.cellElement.children().css({ 'color': '#000' });
        }

        if(e.rowType === 'groupFooter' && e.column.dataField === 'SaleAmount') {
            e.cellElement.css({ 'font-style': 'italic' });
        }
    }

    function customizeExcelCell(options) {
        var gridCell = options.gridCell;
        if(!gridCell) {
            return;
        }

        if(gridCell.rowType === 'data') {
            if(gridCell.data.OrderDate < new Date(2014, 2, 3)) {
                options.font.color = '#AAAAAA';
            }
            if(gridCell.data.SaleAmount > 15000) {
                if(gridCell.column.dataField === 'OrderNumber') {
                    options.font.bold = true;
                }
                if(gridCell.column.dataField === 'SaleAmount') {
                    options.backgroundColor = '#FFBB00';
                    options.font.color = '#000000';
                }
            }
        }

        if(gridCell.rowType === 'group') {
            if(gridCell.groupIndex === 0) {
                options.backgroundColor = '#BEDFE6';
            }
            if(gridCell.groupIndex === 1) {
                options.backgroundColor = '#C9ECD7';
            }
            if(gridCell.column.dataField === 'Employee') {
                options.value = gridCell.value + " (" + gridCell.groupSummaryItems[0].value + " items)";
                options.font.bold = false;
            }
            if(gridCell.column.dataField === 'SaleAmount') {
                options.value = gridCell.groupSummaryItems[0].value;
                options.numberFormat = "&quot;Max: &quot;$0.00";
            }
        }

        if(gridCell.rowType === 'groupFooter' && gridCell.column.dataField === 'SaleAmount') {
            options.value = options.gridCell.value;
            options.numberFormat = "&quot;Sum: &quot;$0.00";
            options.font.italic = true;
        }

        if(gridCell.rowType === 'totalFooter' && gridCell.column.dataField === 'SaleAmount') {
            options.value = options.gridCell.value;
            options.numberFormat = "&quot;Total Sum: &quot;$0.00";
        }
    }
</script>
